SVG → D3 Conversion & Manipulation Pipeline

Step 1: API Configuration

API Provider: OpenAI Google Gemini

API Key: Find out possible models

Model: Loading models...

Step 2: Input SVG & Convert

You can use https://www.svgminify.com/ to shorten your SVG input. It will make the process much faster.

Step 3: Test Manipulations

Select manipulation type: -- Choose manipulation -- Filter by value range Show only top 5 Sort descending by value Group by category and sum values Add moving average (rolling window) Create ratio/normalized score field Apply log transformation Bin data into categories Create small multiples/facets Show random sample of data Add drill-down on click Toggle dark mode Convert to scatter plot Swap X and Y axes Change color scheme Increase font size Change to logarithmic scale Adjust margins and padding Show/hide gridlines Apply high-contrast palette Use color-blind friendly palette Add data labels to marks Add trend/regression line Add reference bands Add text annotations Add fisheye lens magnifier Highlight specific zones Add zoom/pan Add tooltips Add animation Add brush selection Add lasso selection Enable multi-select (Shift/Ctrl) Add cross-chart highlighting Add range slider control Add dropdown filter Add date picker Add play/pause animation controls Add right-click context menu Add undo/redo functionality Add toggle switch controls Add export PNG/CSV button Add keyboard shortcuts Play sound on hover/click Sonify data values (pitch mapping) Add speech output for values

Or enter custom manipulation prompt:

Apply Manipulation Test Another

Step 4: Results

Download HTML